import React, { Component, useEffect } from 'react';
import { SearchinputStyle } from './SearchInputStyle.js'
import imgIconont from '../../assets/mainIconfont/小米.png'
import imgSearch from '../../assets/mainIconfont/搜索.png'

const SearchInput = (props) => {
	const { handleOnclick, SearchBoxhandleOnclick,display } = props;
	// console.log(display,'/////////////////////////');
	// console.log(handleOnclick(),'---------------------');
	
	return (
			<SearchinputStyle >
				<div className={display? "container2 " : "container1"}>
					<div className='iconfont'>
						<img src={imgIconont} alt="" />
					</div>
					<div className="search-input">
						<p className='search-border'>
							<img className='search-img' src={imgSearch}></img>
						</p>
						<input type="text" placeholder='搜索商品' disabled onFocus={SearchBoxhandleOnclick} />
					</div>
				
				</div>
			</SearchinputStyle>
		
	)
}

export default SearchInput
